<template>
	<view class="font login">
		<image src="https://img-baofun.zhhainiao.com/fs/6f491f705a299b3fdd571aa5b095058a.jpg" mode="aspectFill"></image>
		<view class="bg">
			<button class='login-btn' type='primary' @click="bindGetUserInfo"> 微信登录 </button>
			<button class="phone-login-btn" @click="phoneLogin">手机号登录</button>
			<login-box ref="refShow"></login-box>
		</view>
	</view>
</template>

<script>
	import loginBox from '@/pages/login/phoneLogin'
	export default{
		name:"login",
		components:{
			loginBox
		},
		data() {
			return {
				nickName: null, //昵称
				avatarUrl: null, //头像
				why:false,
				formid:""
				// isCanUse: uni.getStorageSync('isCanUse') || true, //默认为true
				// userInfo: {},
				// canIUse: uni.canIUse('button.open-type.getUserInfo'),
				// canIGetUserProfile: false,
				// detail: {},
				// openid: null,
				// gender: null,
				// city: null,
				// province: null,
				// country: null,
				// session_key: null,
				// unionid: null,
			}
		},
		 onLoad(option) { //默认加载
		 if(option.why){
			 this.why = option.why
			 this.formid = option.formid
		 }
				var _this = this;
				// uni.checkSession({
				// 	success() {
				// 		if(uni.getStorageSync('openId')){
				// 			uni.showLoading({
				// 				title:"自动登陆",
				// 				mask:true
				// 			})
				// 			setTimeout(()=>{
				// 				uni.hideLoading()
				// 				uni.reLaunch({
				// 					url: '/pages/index/index'
				// 				});
				// 			},1500)
				// 		}
				// 	},
				// 	fail() {
				// 		uni.clearStorage()
				// 	}
				// })
				
				//console.log(uni.getUserProfile);
				// if (uni.getUserProfile) {
				// 	this.canIGetUserProfile = true;
				// }
				// console.log(this.canIGetUserProfile)
				//判断若是版本不支持新版则采用旧版登录方式
				//查看是否授权
				// if (!this.canIGetUserProfile) {
				// 	uni.getSetting({
				// 		success: function(res) {
				// 			if (res.authSetting['scope.userInfo']) {
				// 				uni.getUserInfo({
				// 					provider: 'weixin',
				// 					success: function(res) {
				// 						_this.userInfo = res.userInfo;
				// 						try {
				// 							uni.setStorageSync('isCanUse', false);
				// 							_this.login();
				// 						} catch (e) {}
				// 					},
				// 					fail(res) {}
				// 				});
				// 			} else {
				// 				// 用户没有授权
				// 				console.log('用户还没有授权');
				// 			}
				// 		}
				// 	});
				// }
	
			},
			methods: {
				phoneLogin(){
					this.$refs.refShow.showBox()
				},
				//第一次授权
				bindGetUserInfo(e) {
					uni.showLoading({
						mask:true,
						title:"登陆中"
					})
					var _this = this;
					_this.login()
					// if (this.canIGetUserProfile) {
					// 	//新版登录方式
					// 	uni.getUserProfile({
					// 		desc: '登录',
					// 		success: (res) => {
					// 			_this.userInfo = res.userInfo;
					// 			try {
					// 				_this.login();
					// 			} catch (e) {}
					// 		},
					// 		fail: (res) => {
					// 			console.log('用户还没有授权');
					// 		}
					// 	});
					// } else {
					// 	if (e.detail.userInfo) {
					// 		_this.userInfo = e.detail.userInfo;
					// 		try {
					// 			_this.login();
					// 		} catch (e) {}
					// 	} else {
					// 		console.log('用户拒绝了授权');
					// 		//用户按了拒绝按钮
					// 	}
					// }
				},
				//登录
				login() {
					let _this = this;
					// 获取登录用户code
					uni.getProvider({
						service: 'oauth',
						success: function(res) {
							if (~res.provider.indexOf('weixin')) {
								uni.login({
									provider: 'weixin',
									success: function(res) {
										console.log(res);
										if (res.code) {
											let code = {"code":res.code};
											_this.$request('/LoginPage/wxLogin','POST',code)
											.then(res=>{
												if (res.data.code == 200) {
													uni.hideLoading()
													uni.setStorageSync('openId',res.data.data.openId)
													uni.setStorageSync('token',res.data.data.token)
													if(_this.why){
														uni.navigateBack()
													}else{
														uni.reLaunch({ //信息更新成功后跳转到小程序首页
															url: '/pages/index/index'
														});
													}
												}
											}).catch(err =>{
												uni.showToast({
													title:err.errMsg,
													icon:"none"
												})
											})
											//将用户登录code传递到后台置换用户SessionKey、OpenId等信息
											//...写用code置换SessionKey、OpenId的接口
											//置换成功调用登录方法_this.updateUserInfo();
										} else {
											uni.showToast({
												title: '登录失败！',
												duration: 2000
											});
										}
									},
								});
							} else {
								uni.showToast({
									title: '请先安装微信或升级版本',
									icon: "none"
								});
							}
						}
						// 
					});
				}
			},
	}
</script>

<style lang="less">
	// page{
	// 	background: "@/static/loginBg.jpg";
	// 	background-repeat: no-repeat;
	// 	background-size: cover;
	// }
	/* 在线链接服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
	.login{
		// width: 100%;
		height: 100vh;
		margin: 0;
		padding: 0;
		position: relative;
	}
	image{
		position: absolute;
		width: 100vw;
		height: 100vh;
	}
	.bg{
		position: absolute;
		width: 100%;
		height: 100vh;
		z-index: 1;
	}
	.phone-login-btn{
		position: absolute;
		bottom: 40rpx;
		left: 50%;
		transform: translateX(-50%);
		display: flex;    
		justify-content: center;  
		align-items: center;
		width: 80%;
		background-color: #1da0fa;
		color: white;
	}
	.login-btn{
		position: absolute;
		bottom: 180rpx;
		left: 50%;
		transform: translateX(-50%);
		display: flex;    
		justify-content: center;  
		align-items: center;
		width: 80%;
	}
</style>